<template>
    <div class="wrap">
        <div class="container">
            <TopBreadCrumb></TopBreadCrumb>
            <div class="user_center_content">
                <!-- 左侧菜单 -->
                <LeftNavMenu></LeftNavMenu>
                <!-- 左侧菜单结束 -->
                <!-- 右侧内容开始  -->
                <div class="right_user_content">
                    <div class="right-title border-bottom">
                        <div class="left">授权详情</div>
                    </div>
                    <div class="accredit-centent" v-loading="loading">
                        <!-- 授权成功 -->
                        <div class="succeeds" v-if="model.status == 1">
                            <span class="el-icon-success"></span>
                            <div class="text-xl">恭喜您，授权成功！</div>
                            <el-button type="text" @click="downloadAccredit" v-if="model.empower_second != null && model.empower_second != ''">点击查看授权书信息</el-button>
                            <el-button type="text" v-else>等待管理员上传授权书</el-button>
                        </div>
                        <!-- 授权信息 -->
                        <div class="item">
                            <span>授权企业名称：</span>
                            <span>{{ model.factory_name }}</span>
                        </div>
                        <div class="item">
                            <span>被授权企业名称：</span>
                            <span>{{ model.enterprise_name }}</span>
                        </div>
                        <div class="item">
                            <span>授权产品：</span>
                            <span>{{ model.product.map(x => x.title).join(",") }}</span>
                        </div>
                        <div class="item">
                            <span>合作类型：</span>
                            <span>{{ model.cooperate_type }}</span>
                        </div>
                        <div class="item">
                            <span>合作区域：</span>
                            <span>{{ model.area + model.cooperate_hospital + model.cooperate_hospital_department }}</span>
                        </div>
                        <div class="item">
                            <span>营业执照：</span>
                            <span class="img-box">
                                <el-image 
                                    :src="model.business_license" 
                                    :preview-src-list="[model.business_license]">
                                </el-image>
                                <!-- <img src="@/assets/images/yyzz.png" alt=""> -->
                            </span>
                        </div>
                        <div class="item">
                            <span>医疗器械许可证：</span>
                            <span class="img-box">
                                <el-image 
                                    :src="model.medical_device_license" 
                                    :preview-src-list="[model.medical_device_license]">
                                </el-image>
                                <!-- <img src="@/assets/images/yyzz.png" alt=""> -->
                            </span>
                        </div>
                        <div class="item" v-if="model.third_party_license">
                            <span>第三方许可证：</span>
                            <span class="img-box">
                                <el-image
                                    :src="model.third_party_license" 
                                    :preview-src-list="[model.third_party_license]">
                                </el-image>
                                <!-- <img src="@/assets/images/yyzz.png" alt=""> -->
                            </span>
                        </div>

                        <!-- 上传授权书 -->
                        <!-- <div class="accredit-btn-group" v-if="model.status == 0">
                            <el-button class="btn-main">上传授权书</el-button>
                            <el-button type="text">点击导出授权书信息</el-button>
                        </div> -->

                    </div>
                </div>
                <!-- 右侧内容结束 -->
            </div>
        </div>
     
    </div>
</template>

<script>
import api from "@/api/empower";
export default {
    validate({ params }) {
        // 必须是number类型
        return /^\d+$/.test(params.id)
    },
    data() {
        return {
            loading: false,
            model: {
                factory_id: null, // 授权企业
                factory_name: "",
                enterprise_id: null, // 被授权企业
                enterprise_name: "",
                product: [],
                empower_product_ids: [], // 授权产品ids
                cooperate_type: null, // 授权类型
                
                cooperate_province_id: null,
                cooperate_city_id: null,
                cooperate_county_id: null,
                cooperate_town_id: null,

                cooperate_hospital: "", // 医院
                cooperate_hospital_department: "", // 医院科室

                province_id: null,
                city_id: null,
                county_id: null,
                town_id: null,
                address: "", // 详细地址
                business_license: "", // 营业执照
                medical_device_license: "", // 医疗器械许可证
                filings_prove: "", // 备案证明
                remark: "", // 备注
            }
        };
    },
    methods: {
        onSubmit(){

        },
        // 加载详情信息
        LoadEmpowerInfo: function () {
            var _this = this;
            var input = {
                id: _this.$route.params.id
            }
            _this.loading = true;
            api.GetEmpowerInfo(input)
                .then((res) => {
                    _this.model = res.data;
                    _this.model.business_license = _this.$commonImageUrl(_this.model.business_license);
                    _this.model.medical_device_license = _this.$commonImageUrl(_this.model.medical_device_license);
                    _this.model.third_party_license = _this.model.third_party_license != null ? _this.$commonImageUrl(_this.model.third_party_license) : "";
                    _this.loading = false;
                }).catch((err) => {
                    _this.loading = false;
                })
        },
        downloadAccredit: function () {
            // 创建一个隐藏的 <a> 标签并设置下载链接
            var link = document.createElement('a');
            link.href = this.model.empower_second;
            link.download = this.model.username + "-授权书" + '.pdf';
            // 触发点击事件进行下载
            link.click();
        }
    },
    mounted: function(){
        this.LoadEmpowerInfo();
    }
};
</script>